import { reactive, ref, onUnmounted, onMounted } from '@vue/runtime-core'
import { getScreenSize } from '../../utils/index'
export const useEnemyPlane = (params) => {
  const { width: screenWidth, height: screenHeight } = getScreenSize()
  const width = 160
  const height = 100
  const x = Math.floor(Math.random() * (screenWidth - width))
  const enemyPlans = reactive([{
    x,
    y: 0,
    width,
    height
  }])
  let timer
  onMounted(() => {
    timer = setInterval(() => {
      const x = Math.floor(Math.random() * (screenWidth - width))
      enemyPlans.push({
        x,
        y: 0,
        width,
        height
      })
    }, 800)
  })
  onUnmounted(() => {
    setInterval(timer)
    timer = null
  })
  return {
    enemyPlans
  }
}
